<html xmlns="http://www.w3.org/1999/xhtml" xmlns:c="http://java.sun.com/jstl/core"
      xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:t="http://myfaces.apache.org/tomahawk">

    <f:view>
        <f:loadBundle var="text" basename="#{employeeList.bundleName}"/>
        <head>
            <title>#{text['employeeList.title']}</title>
            <meta name="heading" content="#{text['employeeList.heading']}"/>
            <meta name="menu" content="AdminMenu"/>
        </head>
        <body id="employeeList">
        <h:form id="editemployee">

            <h:commandButton value="#{text['button.add']}" action="add" id="add" immediate="true" styleClass="button"/>
            <h:commandButton value="#{text['button.done']}" action="mainMenu" id="cancel" immediate="true" styleClass="button" style="margin-left: 5px"/>

            <!-- Error from this table is caused by http://issues.apache.org/jira/browse/TOMAHAWK-466 -->
            <t:dataTable id="employees" var="employee" style="margin-top: 10px"
                         value="#{employeeList.employees}" rows="25" sortColumn="#{employeeList.sortColumn}"
                         sortAscending="#{employeeList.ascending}" styleClass="scrollerTable table"
                         headerClass="standardTable_Header" rowClasses="standardTable_Row1,standardTable_Row2"
                         columnClasses="standardTable_Column,standardTable_Column,standardTable_Column,standardTable_Column,standardTable_ColumnCentered">

                <t:column>
                    <f:facet name="header">
                        <t:commandSortHeader columnName="id" arrow="true">
                            <h:outputText value="#{text['employee.id']}" />
                        </t:commandSortHeader>
                    </f:facet>
                    <h:commandLink action="#{employeeForm.edit}" value="#{employee.id}">
                        <f:param name="id" value="#{employee.id}"/>
                        <f:param name="from" value="list"/>
                    </h:commandLink>
                </t:column>

                <t:column>
                    <f:facet name="header">
                        <t:commandSortHeader columnName="firstName" arrow="true">
                            <h:outputText value="#{text['employee.firstName']}" />
                        </t:commandSortHeader>
                    </f:facet>
                    <h:outputText value="#{employee.firstName}" escape="true"/>
                </t:column>

                <t:column>
                    <f:facet name="header">
                        <t:commandSortHeader columnName="lastName" arrow="true">
                            <h:outputText value="#{text['employee.lastName']}" />
                        </t:commandSortHeader>
                    </f:facet>
                    <h:outputText value="#{employee.lastName}" escape="true"/>
                </t:column>

                <t:column>
                    <f:facet name="header">
                        <t:commandSortHeader columnName="mobilePhone" arrow="true">
                            <h:outputText value="#{text['employee.mobilePhone']}" />
                        </t:commandSortHeader>
                    </f:facet>
                    <h:outputText value="#{employee.mobilePhone}" escape="true"/>
                </t:column>

                <t:column>
                    <f:facet name="header">
                        <t:commandSortHeader columnName="email" arrow="true">
                            <h:outputText value="#{text['employee.email']}" />
                        </t:commandSortHeader>
                    </f:facet>
                    <h:outputText value="#{employee.email}" escape="true"/>
                </t:column>

                <t:column>
                    <f:facet name="header">
                        <t:commandSortHeader columnName="occupation" arrow="true">
                            <h:outputText value="#{text['employee.occupation']}" />
                        </t:commandSortHeader>
                    </f:facet>
                    <h:outputText value="#{employee.occupation}" escape="true"/>
                </t:column>

            </t:dataTable>

            <ui:include src="/common/tableFooter.xhtml">
                <ui:param name="tableName" value="employees"/>
            </ui:include>

            <script type="text/javascript">
                highlightTableRows("editemployee:employees");
            </script>

        </h:form>
    </body>
</f:view>
</html>